<style type="text/css">
    .daystyle {
        width:  66px;
        color: cornflowerblue;
    } 
</style>
<div class="panel panel-default mt20">
    <div class="panel-body">
        <div class="col-sm-12">
            <div class="row ">
                <div class="col-sm-2">
                    <input type="text" class="form-control" ng-model="searchform.code" ng-keyup="myKeyup($event)" placeholder="订单编号">
                </div> 
                <div class="col-sm-2">
                    <div class="input-group" datetimepicker ng-model="vm.date" options="vm.options">
                        <input class="form-control" placeholder="起始时间"/>
                        <span class="input-group-addon">
                            <span class="glyphicon glyphicon-calendar"></span>
                        </span>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="input-group" datetimepicker ng-model="vm1.date" options="vm1.options">
                        <input class="form-control" placeholder="结束时间"/>
                        <span class="input-group-addon">
                            <span class="glyphicon glyphicon-calendar"></span>
                        </span>
                    </div>
                </div>
                
                <div class="col-sm-2">
                    <ui-select ng-model="searchform.place_name" theme="bootstrap" ng-keyup="myKeyup($event)" ng-change="changehotel(searchform.place_name)">
                        <ui-select-match placeholder="酒店">
                            {{$select.selected.name}}
                        </ui-select-match>
                        <ui-select-choices repeat="hotellist.name as hotellist in hotelarr | filter: $select.search" >
                            <span ng-bind-html="hotellist.name | highlight: $select.search"></span>
                        </ui-select-choices>
                    </ui-select>
                </div> 
                <div class="col-sm-2">
                    <ui-select ng-model="searchform.cancel_state_name" theme="bootstrap" ng-keyup="myKeyup($event)">
                        <ui-select-match placeholder="订单状态">
                            {{$select.selected.name}}
                        </ui-select-match>
                        <ui-select-choices repeat="cancelstatenamelist.value as cancelstatenamelist in cancelstatenamearr | filter: $select.search">
                            <span ng-bind-html="cancelstatenamelist.name | highlight: $select.search"></span>
                        </ui-select-choices>
                    </ui-select>
                </div>
                <div class="col-sm-2">
                    <button class="btn btn-block btn-info" ng-click="getlist()">搜索</button>
                </div> 
                <!-- <div class="col-sm-1 mt5 daystyle">
                    <a ng-click="yesterday()" class="daystyle">昨天</a>
                </div>  
                <div class="col-sm-1 mt5 daystyle">
                    <a ng-click="week()" class="daystyle">7天</a>
                </div>
                <div class="col-sm-1 mt5 daystyle">
                    <a ng-click="month()" class="daystyle">30天</a>
                </div>  
                <div class="col-sm-2">
                    <input type="text" class="form-control" ng-model="searchform.name" ng-keyup="myKeyup($event)" placeholder="订单编号">
                </div>     
                <div class="col-sm-2">
                    <input type="text" class="form-control" ng-model="searchform.name" ng-keyup="myKeyup($event)" placeholder="联系人姓名">
                </div>   -->
            </div>
           
            
        </div>
    </div>
    </div>
    </div>
</div>
<!-- searchArea -->

<div class="panel panel-default mt20">
    <div class="panel-body">
        <table class="table table-condensed table-hover table-bordered" style="display: table; width: 100%;table-layout:fixed;">
            <thead>
                <tr>
                    <th class="text-center" style="width:13%; text-align:center;vertical-align:middle;">订单号</th>
                    <th class=" text-center" style="width:8%; text-align:center;vertical-align:middle;">房型</th>
                    <th class=" text-center" style="width:16%; text-align:center;vertical-align:middle;">间数</th>
                    <th class=" text-center" style="width:13%; text-align:center;vertical-align:middle;">入住/离店</th>
                    <th class=" text-center" style="width:5%; text-align:center;vertical-align:middle;">金额</th>
                    <th class=" text-center" style="width:9%; text-align:center;vertical-align:middle;">姓名</th>
                    <th class=" text-center" style="width:12%; text-align:center;vertical-align:middle;">预定时间</th>
                    <th class=" text-center" style="width:8%; text-align:center;vertical-align:middle;">订单状态</th>
                    <th class=" text-center" style="width:8%; text-align:center;vertical-align:middle;">支付状态</th>
                    <th class=" text-center" style="width:8%; text-align:center;vertical-align:middle;">操作</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="obj in objs ">
                    <td class="text-center" style="width:13%; text-align:center;vertical-align:middle;">{{obj.code}}
                        <br><div class="ellipsis" style="max-width:100%;display:block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;" title="{{obj.place_name}}">{{obj.place_name}}</div>
                    </td>
                    <td class="text-center" style="width:8%; text-align:center;vertical-align:middle;">
                        <div class="ellipsis" style="max-width:100%;display:block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;padding-left: 0px;padding-right:0px;" title="{{obj.hotel_name}}">{{obj.hotel_name}}</div>
                    </td>
                    <td class="text-center" style="width:16%; text-align:center;vertical-align:middle;">
                        <div ng-repeat="room in obj.roomList">{{room.tour_date}}日:{{room.num}}间</div>
                    </td>
                    <td class="text-center form-group" style="width:13%; text-align:center;vertical-align:middle;">
                        <p class="pull-left">
                            {{obj.min_time}}<br>{{obj.max_time}}
                        </p>
                        <div style="height:100%; margin-top:10%">
                            <p class="" style="vertical-align:middle;height:100%">共{{obj.roomList.length}}晚</p>
                        </div>
                    </td>
                    <td class="text-center" style="width:5%; vertical-align:middle;">{{(obj.pay_fee / 100) | currency : '¥'}}</td>
                    <td class="text-center" style="width:9%; vertical-align:middle;">
                        <div class="ellipsis" style="max-width:100%;display:block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;padding-left: 0px;padding-right:0px;" title="{{obj.creat_by}}">{{obj.creat_by}}</div>
                    </td>
                    <td class="text-center" style="width:12%; vertical-align:middle;">{{obj.create_time}}</td>
                    <td class="text-center" style="width:8%; vertical-align:middle;">
                        {{obj.cancel_state_name}}
                    </td>
                    <td class="form-horizontal text-center" style="width:8%; vertical-align:middle;">{{obj.pay_state_name}}
                    </td>
                    <td class="text-center" style="width:8%; vertical-align:middle;">
                        <a ng-click="orderdetail(obj)" class="btn btn-success btn-xs">查看详情</a>
                    </td>
                </tr>
            </tbody>
        </table>


        <div class="text-right">

                <pagination total-items="bigTotalItems" ng-model="bigCurrentPage" ng-change="getlist()" previous-text="上一页" next-text="下一页"
                first-text="首页" last-text="尾页" max-size="maxSize" boundary-links="true" rotate="false" items-per-page="itemsPerPage"
                class="m-t-none m-b">
            </pagination>

        </div>


    </div>
</div>